let vm = new Vue({
    el: ".main-content",
    data: function () {
        return {
            pageInfo: {},
            name: "全部",
            condition: {
                type: '',
                name: '',
                status:''
            },
            setting: {
                data: {
                    simpleData: {
                        enable: true,
                        idKey: 'id',
                        pIdKey: 'parentId',
                    },
                },
                callback: {
                    onClick: this.onClick
                },
                view: {
                    fontCss: this.fontCss
                }
            },

            nodes:[]
        }
    },
    methods: {

        initTree: function () {
            //初始化nodes数据
            axios({
                url: "/guguanjia/office/findAll"
            }).then(response => {
                    this.nodes=response.data;
                    this.nodes[this.nodes.length]={"id": 0, "name": "全部"};
                    $.fn.zTree.init($("#pullDownTreeone"), this.setting, this.nodes)
            }).catch(error => {
                layer.msg(error.message)
            })

        },
        onClick: function (event,treeld,treeNode) {
            this.name=treeNode.name;
            if(treeNode.id===0){
                //如果选择的是全部
                this.condition.id=null;
            }else{
                //绑定查询条件
                this.condition.id=treeNode.id;
            }

            //删除open
            $(".btn-group").removeClass("open");
        },
        search: function () {
            //根据树id获取树对象
            let treeObj = $.fn.zTree.getZTreeObj("pullDownTreeone");

            //初始化树节点，防止之前设置的high届性影响
            //transformToArray :将多维结构节点数组，转换成简单数纽―维结构
            let arrayNodes = treeObj.transformToArray(treeObj.getNodes());
            for (let i = 0; i <arrayNodes.length ; i++) {
                arrayNodes[i].hightLight=false;
                //更新节点，触发调用 fontCss 方法
                treeObj.updateNode(arrayNodes[i])
            }


            //getNodesByParamFuzzy ( key , value, parentNode ) :根据key指定的届性，value指定的值
            // 从指定的parentNode节点中模糊查找parentNode为null则全部查找
            let nodesFuzzy = treeObj.getNodesByParamFuzzy("name",this.name,null);

            //将所有查找到的元素设置为高亮
            for (let i in nodesFuzzy) {
                nodesFuzzy[i].hightLight=true;

                //更新节点，触发调用 fontCss 方法
                treeObj.updateNode(nodesFuzzy[i])
            }


        },
        fontCss: function (treeId, treeNode) {
            // 根据高亮标记设置高亮红色
            return treeNode.hightLight ? {"color": "red"} : {"color": "black"}

        },


        selectPage: function (pageNum = 1, pageSize = 10) {
            axios({
                url: `/guguanjia/admin/work/findAll/${pageNum}/${pageSize}`,
                params: this.condition
            }).then(response => {
                this.pageInfo = response.data;
            }).catch(error => {
                layer.msg(error.message)
            });
        },
        selectAll: function () {
            this.condition = {
                type: '',
                name: '',
                status:''
            };
            this.name= '全部';
            this.selectPage()
        },

        toUpdate: function (id) {
            layer.open({
                type: 2,
                skin: 'layui-layer-demo', //样式类名
                title: '编辑',
                closeBtn: 1, //不显示关闭按钮
                anim: 2,
                area: ['80%', '80%'],
                shadeClose: true, //开启遮罩关闭
                content: '/guguanjia/admin/work/toUpdate',
                success: function (aa, index) {
                    var iframe = window['layui-layer-iframe' + index];
                    iframe.abc(id)
                },
            })

        }

    },
    created: function () {
        this.selectPage()
    },
    mounted: function () {
        this.initTree();
    }

});

